/**
 * @description ChartComponent 底层组件
 */

import React, {PureComponent} from 'react';
import {merge} from 'lodash';
import dvTool from "@/pages/dv/dvTool";

interface IProps extends DV.IChart {
  actions: DV.IChartActions
}

interface IState {

}

export default class ChartComponent extends PureComponent<IProps, IState> {
  public myChart: any;
  public box: any;
  public option: any;

  constructor(props: DV.IChart) {
    super(props);
    this.myChart = null;
    this.box = null;
    this.option = this.getMergeOption();
  }

  componentDidMount() {
    this.myChart = this.initInstance(this.getModule(), this.option);
    this.cacheChart();
    this.onMount(this.option);
  }

  /**
   * 加载完成时
   */
  public onMount(option: any) {

  }

  /**
   * 缓存实例
   */
  private cacheChart() {
    this.props.uid && dvTool.cacheChartInstance(this.props.uid, {
      myChart: this.myChart,
      box: this.box,
      chart: {
        update: this.update,
        resizeChart: this.resizeChart.bind(this),
        resetChart: this.resetChart.bind(this),
        ...this.props.actions
      }
    });
  }


  /**
   * 实例化
   * @param module
   * @param option
   */
  public initInstance(module: any, option: any) {
    return module;
  }

  /**
   * 获取模块依赖
   */
  public getModule(): any {
    return {};
  }


  /**
   * 获取总配置项
   */
  protected getMergeOption() {
    let option = merge(this.getBaseOption(), this.getPublicOption());

    // 深度合并配置
    option = merge(option, this.getOption());
    return option;
  }

  /**
   * 获取基础配置
   */
  public getBaseOption() {
    return {};
  }

  /**
   * 获取公共配置
   */
  public getPublicOption() {
    return {};
  }

  /**
   * 获取动态枚举配置
   */
  private getOption() {
    return this.props.config?.option || {};
  }

  /**
   * 重置大小
   */
  public resizeChart = () => {

  }

  /**
   * 清除配置
   */
  public resetChart() {

  }

  /**
   * option 图表的配置项和数据，具体见配置项手册。
   * @param option
   * @param notMerge 可选，是否不跟之前设置的 option 进行合并，默认为 false，即合并。
   * @param lazyUpdate 可选，在设置完 option 后是否延迟更新图表，默认为 false，即立即更新。
   */
  public update = (option: any, notMerge = false, lazyUpdate = false) => {
    try {
      // 更新操作

    } catch (e) {
      console.error('组件[' + this.props.uid + ']高级配置更新错误：' + e.message);
    }
  }

  /**
   * 卸载组件时
   */
  onUnmount() {

  }

  componentWillUnmount(): void {
    this.onUnmount();
  }

  render() {
    return (<div
      className="chart-item"
      ref={e => {
        this.box = e
      }}
    />);
  }
}
